import React, {PureComponent} from 'react'
import '../../../css/base-detail.scss'
import {millToString, millToDate} from '../../util/util'
class DetailTable extends PureComponent {
    constructor() {
        super()
    }

    componentDidMount() {

    }

    render() {
        const {setMask, detail} = this.props

        console.log(detail.createTime)
        const data = [
            {
                title: '推送序号',
                content: detail.sendNumber,
                width: '50%',
                key: 'xuhao'
            },
            {
                title: '推送时间-关闭时间',
                content: millToDate(detail.createTime) + '-' + (detail.status ? millToDate(detail.closedTime) : ''),
                width: '50%',
                key: 'xuhao1'
            },
            {
                title: '责任人',
                content: (detail.userEmail || '').split('@')[0],
                width: '50%',
                key: 'xuhao2'
            },
            {
                title: '处理周期',
                content: detail.status?new Date(detail.closedTime - detail.createTime).getDate()-1+'天'+
                    new Date(detail.closedTime - detail.createTime).getHours()+'小时':'处理中',
                width: '50%',
                key: 'xuhao3'
            },
            {
                title: '问题描述',
                content: detail.problemDesc,
                width: '100%',
                key: 'xuhao4'
            }
            ,
            {
                title: '问题分析',
                content: detail.causalAnalysis,
                width: '100%',
                key: 'xuhao5'
            }
            ,
            {
                title: '处理措施',
                content: detail.treatmentMeasure,
                width: '100%',
                key: 'xuhao6'
            },
            {
                title: '预防措施',
                content: detail.preventiveMeasure,
                width: '100%',
                key: 'xuhao7'
            },
            {
                title: '原因大类',
                content: detail.causeLargeClass,
                width: '50%',
                key: 'xuhao8'
            },
            {
                title: '原因小类',
                content: detail.causeSmallClass,
                width: '50%',
                key: 'xuhao9'
            },
            {
                title: '责任部门确定',
                content: detail.responsibleDepartments,
                width: '100%',
                key: 'xuhao10'
            }


        ]
        return (
            <div className="base-detail-container">
                <ul className="base-detail-info">
                    {data.map((problem, i) => {
                        return <li key={`base-detail-${problem.key}`} style={{width: problem.width}}>
                            <div className="base-detail-title">
                                {problem.title}
                            </div>
                            <div className="base-detail-content">
                                {problem.content}
                            </div>
                        </li>
                    })}
                </ul>
            </div>
        )
    }

}

export default DetailTable